import React from 'react';
import {inject, observer} from 'mobx-react';
import * as mobx from 'mobx';
import {Button, Icon, Row, Col, message} from 'antd';
import {
    WeaLocaleProvider,
    WeaDialog,
    WeaRightMenu,
    WeaMoreButton,
    WeaFormItem,
    WeaSelect,
    WeaInput,
    WeaBrowser,
    WeaUpload,
    WeaColorPicker,
    WeaCheckbox,
    WeaTools,
    WeaTextarea
} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;
import './style/';
import {WeaSearchGroup} from "./setting";
import {WeaPortalShare,WeaMaterialLib} from 'weaPortalPublic';
class Add extends React.Component{

    state = {
        data:{
            employeeId:-1,
            hrmId:'',
            name:'',
            title:'',
            employeeDesc:'',
            employeeOrder:'',
            newEmployeeId:''
        }
    }

    setStateData = (data)=>{
        data = Object.assign({},this.state.data,data);
        this.setState({
            data
        })
    }

    load = (id)=>{
        WeaTools.callApi('/api/portal/newEmployee/saveOrGetEmployeeById', 'POST', {"json":JSON.stringify({id:id})}).then((result) => {
            if (result.status == true) {
                if(result.data != null){
                    this.props.setStateData({data:result.data})
                }
            }
        });
    }


    synchronizedDataItem = ()=>{
        let temp = this.props.state.data
        let emps = temp.emps;
        let data = this.state.data;
        for(let i in emps){
            if(emps[i].employeeId == data.employeeId){
                emps[i] = data
                continue
            }
        }
        this.props.setStateData({
            data:temp
        })
    }

    update = ()=>{
        let data = this.state.data;
        WeaTools.callApi('/api/portal/newEmployee/updateOfId', 'POST', {"json":JSON.stringify({employeeId:data.employeeId,hrmId: data.hrmId,name:data.name,title:data.title,employeeDesc:data.employeeDesc,employeeOrder:data.employeeOrder,newEmployeeId:this.props.state.data.id})}).then((result) => {
            if (result.status == true) {
                //更新后的值，同步到父组件状态，避免重新load
                this.synchronizedDataItem()
                //关闭组件并清空状态
                this.cancelAndClear()
                message.success(getLabel(83551, '保存成功！'), 3);
            } else {
                message.error(getLabel(84544, '保存失败！'), 3);
            }
        });
    }

    saveOrUpdteOfEmployeeId = ()=>{
        const employeeId = this.state.data.employeeId
        if(employeeId != -1){
            this.update();
        }else{
            this.save();
        }
    }

    save = ()=>{
        let data = this.state.data;
        WeaTools.callApi('/api/portal/newEmployee/saveItem', 'POST', {"json":JSON.stringify({employeeId:data.employeeId,hrmId: data.hrmId,name:data.name,title:data.title,employeeDesc:data.employeeDesc,employeeOrder:data.employeeOrder,newEmployeeId:this.props.state.data.id})}).then((result) => {
            if (result.status == true) {
                const id = this.props.state.data.id
                this.load(id)
                this.cancelAndClear()
                message.success(getLabel(83551, '保存成功！'), 3);
            } else {
                message.error(getLabel(84544, '保存失败！'), 3);
            }
        });
    }

    cancelAndClear = ()=>{
        this.props.setStateData({addVisiable:false,setId:-1})
        this.setState({
            data:{
                employeeId:-1,
                hrmId:'',
                name:'',
                title:'',
                employeeDesc:'',
                employeeOrder:'',
                newEmployeeId:''
            }
        })
    }

    componentWillReceiveProps(nextProps){
        const setId = nextProps.state.setId
        const emps = nextProps.state.data.emps
        let empItem
        if(setId != -1){
            for(let i in emps){
                if(emps[i].employeeId == setId ){
                    empItem = emps[i]
                    continue
                }
            }
            this.setState({
                data:{
                    employeeId:empItem.employeeId,
                    hrmId:empItem.hrmId,
                    name:empItem.name,
                    title:empItem.title,
                    employeeDesc:empItem.employeeDesc,
                    employeeOrder:empItem.employeeOrder,
                    newEmployeeId:empItem.newEmployeeId
                }
            })
        }else{
            this.setState({
                data:{
                    employeeId:-1,
                    hrmId:'',
                    name:'',
                    title:'',
                    employeeDesc:'',
                    employeeOrder:'',
                    newEmployeeId:''
                }
            })
        }

    }


    getRightMenus=()=> {
        let btns = [];
        btns.push({key: '1', icon: <i className="icon-coms-Preservation"/>, content: getLabel(30986, '保存'), onClick: ()=>{this.saveOrUpdteOfEmployeeId()}});
        return btns;
    }

    getButtons= ()=> {
        let btns = [];
        btns.push(<Button type="primary" onClick={()=>{this.saveOrUpdteOfEmployeeId()}}>{getLabel(30986, '保存')}</Button>);
        btns.push(<WeaMoreButton datas={this.getRightMenus()}/>);
        return btns;
    }

    render (){

        return (
            <WeaDialog
                title="设置"
                visible={this.props.state.addVisiable}
                iconBgcolor='#1a57a0'
                hasScroll={true}
                style={{width: 700,height:300}}
                buttons={this.getButtons()}
                onCancel={()=>{this.cancelAndClear()}}
            >
                <div className="e9desktop-menu-add">
                    {/*<WeaFormItem label="标题"  labelCol={{span: 6}} wrapperCol={{span: 16}}>*/}

                        {/*<WeaInput value={this.state.data.title} onChange={value => this.setStateData({"title": value})}/>*/}
                    {/*</WeaFormItem>*/}
                    <WeaFormItem label="人员" labelCol={{span: 6}} wrapperCol={{span: 16}}>
                        <WeaBrowser
                            type={1}
                            textDecoration={false}
                            replaceDatas={[{id: this.state.data.hrmId, name:this.state.data.name}]}
                            onChange={(ids, names, datas)=> {this.setStateData({hrmId:ids,name:names})}}
                        />
                    </WeaFormItem>
                    <WeaFormItem label="简介" labelCol={{span: 6}} wrapperCol={{span: 16}}>
                            <WeaTextarea
                                textDecoration={false}
                                value={this.state.data.employeeDesc}
                                onChange={(value)=>{this.setStateData({"employeeDesc":value})}}
                                minRows={5}
                                maxRows={8}
                            />
                    </WeaFormItem>
                </div>

            </WeaDialog>
        )
    }
}
export default Add;